"use client"

import type { Product } from "@/types"
import { ProductCard } from "./product-card"

interface ProductGridProps {
  products: Product[]
  onAddToCart: (product: Product, quantity: number) => void
  onUpdateQuantity: (id: string, quantity: number) => void
  cartItems: { [key: string]: number }
}

export function ProductGrid({ products, onAddToCart, onUpdateQuantity, cartItems }: ProductGridProps) {
  if (products.length === 0) {
    return (
      <div className="flex-1 flex items-center justify-center py-12">
        <div className="text-center">
          <div className="text-4xl mb-2">🍜</div>
          <p className="text-muted-foreground">该分类暂无商品</p>
        </div>
      </div>
    )
  }

  return (
    <div className="flex-1 overflow-y-auto">
      <div className="p-4 space-y-3">
        {products.map((product) => (
          <ProductCard
            key={product.id}
            product={product}
            onAddToCart={onAddToCart}
            onUpdateQuantity={onUpdateQuantity}
            cartQuantity={cartItems[product.id] || 0}
          />
        ))}
      </div>
    </div>
  )
}
